<template>
   <div  class="htmlCon">
      <div>
          <div>
              <div >
                  <el-collapse  :class="moods" v-model="activeName" accordion>
                    <el-collapse-item title="存储" name="1" disabled>
                      <div><i></i><h2>动画</h2></div>
                       <h3>推荐一个动画库：anime.js 附： https://www.animejs.cn/</h3>
                    </el-collapse-item>
                    </el-collapse>
              </div>
          </div>
      </div>
         <div>
               
          </div>
  </div>
</template>

<script>
export default {
    name: "BasicAnimation",
    data(){
      return {
          moods: "conWrapper",
          activeName: ["1"]
      }
    }
}
</script>

<style scoped>

.conWrapper {
  width: 900px;
  border: 1px solid #ddd;
  border-radius: 5px;
  box-shadow: 5px 5px 20px 5px #999;
  padding: 0px 20px;
  border-bottom-color: transparent;
  margin-right: 50px;
}
.htmlCon {
  display: flex;
  justify-content: center;
}
.htmlNav {
  position: fixed;
}
</style>